<template>
    <view class="orderDetial">
        <!-- 待接单 -->
        <WaitOrder :orderDetail="orderDetail" v-if="orderStatus == 0"></WaitOrder>
        <!-- 进行中 -->
        <InProgress :orderDetail="orderDetail" v-if="orderStatus == 1"></InProgress>
        <!-- 待确认 -->
        <ToBeConfirm :orderId="(orderDetail.id as string)" :nodePage="nodePage" v-if="orderStatus == 2"></ToBeConfirm>
        <!-- 已完成 -->
        <Done :orderId="(orderDetail.id as string)" :nodePage="nodePage" :comment="comment" v-if="orderStatus == 3"></Done>
    </view>
</template>

<script setup lang="ts">
import WaitOrder from "./components/waitOrder.vue"
import InProgress from "./components/inProgress.vue"
import ToBeConfirm from "./components/toBeConfirm.vue"
import Done from "./components/done.vue";
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";
import { useOrder } from "@/hooks/useOrder";
import { getNewNodePage } from '@/api/workerPage/order';
import { getCommentOne } from "@/api/other/comment";
const { orderDetail, getOrderInfo } = useOrder()

const orderStatus = ref(1)

onLoad((options: any) => {
    const { status, id } = options
    // 查询订单详情
    getOrderInfo(id)
    if (status === '0') {
        // 待接单
        orderStatus.value = 0
    } else if (status === '1') {
        // 进行中
        orderStatus.value = 1
    } else if (status === '2') {
        // 待确认
        orderStatus.value = 2
        getNodePage(id)
    }else if(status === '3'){
        orderStatus.value = 3
        getNodePage(id)
        getComment(id)
    }
})

// 获取节点分页
const nodePage = ref([])
const getNodePage = (id: string) => {
    getNewNodePage(id).then((res: any) => {
        if (res.code == 0 && res.data) {
            nodePage.value = res.data.list
        }
    })
}
// 获取评价
const comment = ref<any>({})
const getComment = (id:string) => {
    getCommentOne(id).then((res: any) => {
        if (res.code == 0 && res.data) {
            comment.value = res.data
        }
    })
}

</script>

<style lang="scss" scoped>
.orderDetial {
    min-height: 100vh;
    overflow: hidden;
    background: #f8f8f8;
    padding-bottom: 210rpx;
    box-sizing: border-box;
}

:deep(.u-textarea) {
    background: #F8F8F8 !important;
}
</style>